<!--
 * @Author: sbotlp
 * @Email: sbotlp@sina.com
 * @Date: 2019-11-06 22:02:03
 * @LastEditTime: 2019-11-06 23:35:52
 * @Description: http://www.sbotlp.com.cn
 -->
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
  <p>jquery test 1</p>
  <p>jquery test 2</p>
  <p>jquery test 3</p>
  <div id="div1">
    <p>jquery test in dev</p>
  </div>
  <!-- <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script> -->
  <script src='myJQuery.js'></script>
  <script>
    var $p = $('p');
    $p.css('font-size','40px'); // css 是原型方法
    console.log($p.html());  // html 是原型方法
    
    var $div1 = $('#div1');
    $div1.css('color','red');// css 是原型方法
    console.log($div1.html());// html 是原型方法
    // 演示扩展性，插件机制
    $.fn.getNodeName = function() {
      return this[0].nodeName
    }
    console.log($p.getNodeName());  
    console.log($div1.getNodeName()); 
  </script>
</body>

</html>